<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../js/vue.min.js" ></script>
		<script type="text/javascript" src="../js/vue-router.js" ></script>
	</head>
	<body>
		<div id="app">
			<router-link to="/login?id=1&name=xiaoming">登录</router-link>
			<router-link to="/register">注册</router-link>
			
			<router-view></router-view>
		</div>
	</body>
	<script>
		var login={
			template:'<h3>登录--{{$route.query.id}}----{{this.$route.query.name}}</h3>',
			created(){
				//通过route获取传递过来的参数
				console.log(this.$route);
				console.log('id:'+this.$route.query.id);
				console.log('name:'+this.$route.query.name);
			}
		}
		
		var register={
			template:'<h3>注册</h3>'
		}
		
		var router=new VueRouter({
			routes:[
				{path:'/',redirect:"/login"},
				{path:'/login',component:login},
				{path:'/register',component:register}
			]
		});
		
		var vm=new Vue({
			el:"#app",
			data:{
				
			},
			methods:{
				
			},
			router
		});
	</script>
</html>